import styles from './cmsDetail.less';
import Pagination from '../pagination/index';
import { Flex } from 'antd-mobile';
import { Component } from 'react';
export default class cmsDetail extends Component {
  componentWillReceiveProps() {
    this.node.scrollIntoView();
  }
  node = 0;
  render() {
    console.log("​cmsDetail -> render -> this.props.activeTab", this.props.activeTab)
    return (
      <div ref={node => (this.node = node)}>
        <div className={styles.post} ref={node => (this.node = node)}>
          <Flex direction="column" className={styles.postHeader} align="start">
            <span>{this.props.title}</span>
            <span>{this.props.postTime}</span>
          </Flex>
          <Flex direction="column" className={styles.postBody}>
            <span className={styles.title}>{this.props.title}</span>
            <span
              className={styles.content}
              dangerouslySetInnerHTML={{ __html: this.props.content }}
            />
          </Flex>
        </div>
        {this.props.activeTab !== 4 && (
          <div>
            <Pagination
              type="prev"
              title={this.props.prev.title}
              postTime={this.props.prev.postTime}
              index={this.props.prev.index}
              // handleScrollTop={handleScrollTop}
            />
            <Pagination
              type="next"
              title={this.props.next.title}
              postTime={this.props.next.postTime}
              index={this.props.next.index}
              // handleScrollTop={handleScrollTop}
            />
          </div>
        )}
      </div>
    );
  }
}
